<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta name="mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
    <link rel="icon" href="/static/img/logo.png" type="image/png">
    <link rel="stylesheet" href="/static/css/mobile/common.css">
    <link rel="stylesheet" href="/static/css/mobile/auth.css">
    <title>注册 - 智慧答题系统</title>
</head>
<body>
    <div class="auth-wrapper">
        <div class="auth-header">
            <img src="/static/img/logo.png" alt="Logo" class="auth-logo">
            <h1 class="auth-title">加入我们</h1>
            <p class="auth-subtitle">创建账号开始学习</p>
        </div>

        <div class="auth-form">
            <form id="registerForm">
                <div class="form-group">
                    <label class="form-label">用户名</label>
                    <div class="input-group">
                        <span class="input-icon">👤</span>
                        <input type="text" class="form-control" id="username" name="username" 
                               placeholder="请输入用户名" required autocomplete="username">
                    </div>
                </div>

                <div class="form-group">
                    <label class="form-label">邮箱</label>
                    <div class="input-group">
                        <span class="input-icon">📧</span>
                        <input type="email" class="form-control" id="email" name="email" 
                               placeholder="请输入邮箱" required autocomplete="email">
                    </div>
                </div>

                <div class="form-group">
                    <label class="form-label">密码</label>
                    <div class="input-group">
                        <span class="input-icon">🔒</span>
                        <input type="password" class="form-control" id="password" name="password" 
                               placeholder="请输入密码（至少6位）" required autocomplete="new-password">
                    </div>
                </div>

                <div class="form-group">
                    <label class="form-label">确认密码</label>
                    <div class="input-group">
                        <span class="input-icon">🔒</span>
                        <input type="password" class="form-control" id="confirmPassword" name="confirmPassword" 
                               placeholder="请再次输入密码" required autocomplete="new-password">
                    </div>
                </div>

                <button type="submit" class="btn btn-primary btn-block" id="registerBtn">
                    <span id="registerBtnText">注册</span>
                    <span id="registerSpinner" class="spinner" style="display: none;"></span>
                </button>
            </form>

            <div class="auth-links">
                <a href="/login" class="link">已有账号？立即登录</a>
                <a href="/" class="link">返回首页</a>
            </div>
        </div>
    </div>

    <script src="/static/js/mobile/auth.js"></script>
</body>
</html>

